<script>
  import count from './count'
  import events from '@/utils/events'
  import {checkValue} from "./utils/index";
  import { defineComponent } from 'vue'
  const component = defineComponent({
    props:['rules','value','formName'],
    data(){
      return {
        uniqueKey:count.getTime(),
        currentRules:this.rules || [],
        currentValue:this.value || ""
      }
    },
    watch:{
      rules(){
        this.currentRules = [...this.rules]
      },
      value(){
        this.currentValue = this.value
      }
    },
    mounted() {
      events.publish(this.uniqueKey+'-item',{
        formName:this.formName,
        validate:async ()=>{
          return await checkValue(this.currentRules,this.currentValue)
        }
      })
    }
  })
  export default component
</script>

<template>
    <div>
      <slot></slot>
    </div>
</template>

<style scoped>

</style>
